Ext.define('NIM.view.Dashboard.Dashboard' ,{
    extend: 'Ext.panel.Panel',
    alias: 'widget.dashboard',
    id: 'dashboard',
    border: false,
    closable: true,
    title : 'Dashboard',
    layout : {
        type : 'table',
        columns : 2
    },
    items: [{
    	xtype: 'panel',
    	title: '<font style="color : white">Summary Site Area</font>',
    	width: 545,
    	height: 240,
    	border:false,
    	html :'<div id = "piechart"> </div>',
    	margin : '8 0 0 8',
    	header :{
    		    height:30,
    		    style: 'background: rgb(221, 60, 60); color : white',
    		    
    	},
    	listeners : {
			afterrender : function() {
				 if (FusionCharts("areachart")) FusionCharts("areachart").dispose();
				var Chart1 = new FusionCharts("../Ext-4/Charts/Pie2D.swf", "areachart","545", "220", "0", "1");
				Chart1.render('piechart');
				Chart1.setJSONUrl("./Services/Home/Dashboard/Site/Area");

			}

		}
    	
    
    },
    {
    	xtype: 'panel',
    	title: '<font style="color : white">Summary Site Region</font>',
    	width: 545,
    	height: 240,
    	border:false,
    	html :'<div id = "columnd2D"> </div>',
    	margin : '8 0 0 20',
    	header :{
		    height:30,
		    style: 'background: rgb(221, 60, 60)',
    	},
    	listeners : {
			afterrender : function() {
				 if (FusionCharts("columd2dchart")) FusionCharts("columd2dchart").dispose();
				var Chart1 = new FusionCharts("../Ext-4/Charts/Column2D.swf", "columd2dchart","545", "220", "0", "1");
				Chart1.render('columnd2D');
				Chart1.setJSONUrl("./Services/Home/Dashboard/Site/Region");

			}

		}
    
    },
    {
    	xtype: 'panel',
    	title: '<font style="color : white">Summary Site Provinsi</font>',
    	width: 545,
    	height: 240,
    	border:false,
    	margin : '20 0 0 8',
    	html :'<div id = "columnd2D2"> </div>',
    	header :{
		    height:30,
		    style: 'background: rgb(221, 60, 60)',
    	},
    	listeners : {
			afterrender : function() {
				 if (FusionCharts("columd2dchart2")) FusionCharts("columd2dchart2").dispose();
				var Chart1 = new FusionCharts("../Ext-4/Charts/Column2D.swf", "columd2dchart2","545", "220", "0", "1");
				Chart1.render('columnd2D2');
				Chart1.setJSONUrl("./Services/Home/Dashboard/Site/Propinsi");

			}

		}
    
    },
    {
    	xtype: 'panel',
    	title: '<font style="color : white">Summary Tower Region</font>',
    	width: 545,
    	height: 240,
    	border:false,
    	html :'<div id = "StackedColumn2D"> </div>',
    	margin : '20 0 0 20',
    	header :{
		    height:30,
		    style: 'background: rgb(221, 60, 60)',
    	},
    	listeners : {
			afterrender : function() {
				 if (FusionCharts("stackcolumn")) FusionCharts("stackcolumn").dispose();
				var Chart1 = new FusionCharts("../Ext-4/Charts/StackedColumn2D.swf ", "stackcolumn","545", "220", "0", "1");
				Chart1.render('StackedColumn2D');
				Chart1.setJSONUrl("./Services/Home/Dashboard/Tower/Region");

			}

		}
    
    }]
    
    
});